<template>
	<view class="box">
		<view>uni的数据持久化相当于鸿蒙的首选项</view>
		<view style="margin-top: 20px;">

			<button @click="setStorageSync">同步缓存</button>
			<button @click="getStorageSync">同步获取缓存</button>
			<button @click="getStorageInfoSync">同步获取storage</button>
			<button @click="removeStorageSync">同步删除指定key缓存</button>
			<button @click="clearStorageSync">同步清空缓存</button>

		</view>

		<view style="margin-top: 20px;">

			<button @click="setStorage">异步缓存</button>
			<button @click="getStorage">异步获取缓存</button>
			<button @click="getStorageInfo">异步获取Storge </button>
			<button @click="removeStorage">异步删除指定key缓存</button>
			<button @click="clearStorage">异步清空缓存</button>
		</view>

	</view>
</template>

<script setup>
import { ref } from 'vue';

const storeData = ref({})
const setStorageSync = () => {

	try {
		uni.setStorageSync('storage_key', 'hello');
	} catch (e) {
		// error
	}
}

const getStorageSync = () => {

	try {
		const value = uni.getStorageSync('storage_key');
		if (value) {
			console.log(value);
		}
	} catch (e) {
		// error
	}
}

const getStorageInfoSync = () => {

	try {
		const res = uni.getStorageInfoSync();
		console.log(res.keys);
		console.log(res.currentSize);
		console.log(res.limitSize);
	} catch (e) {
		// error
	}

}

const removeStorageSync = () => {

	try {
		uni.removeStorageSync('storage_key');
	} catch (e) {
		// error
	}

}

const clearStorageSync = () => {
	try {
		uni.clearStorageSync();
	} catch (e) {
		// error
	}

}

const setStorage = () => {

	uni.setStorage({
		key: 'storage_key',
		data: 'hello',
		success: function () {
			console.log('success');
		}
	});
}

const getStorage = () => {

	uni.getStorage({
		key: 'storage_key',
		success: function (res) {
			console.log(res.data);
		}
	});
}

const getStorageInfo = () => {

	uni.getStorageInfo({
		success: function (res) {
			console.log(res.keys);
			console.log(res.currentSize);
			console.log(res.limitSize);
		}
	});
}

const removeStorage = () => {

	uni.removeStorage({
		key: 'storage_key',
		success: function (res) {
			console.log('success');
		}
	});
}

const clearStorage = () => {

	uni.clearStorage();
}

</script>

<style>
.box {
	padding: 20px;
}
</style>
